<template>
  <el-container>
    <el-header>
      <!-- {{ $store.state.userInfo.uname }} -->
      <page-header></page-header>
    </el-header>
    <el-container>
      <el-aside>
        <router-link to="/main/doctor">doctor</router-link>
      </el-aside>
      <el-main>
        <router-view></router-view>
        <!-- <h1>HOME VIEWS</h1>
        <el-button>uaccess: {{ $store.state.b.userInfo.uaccess }}</el-button>
        <el-button type="warning" @click="modifyUserInfo"
          >modifyUserInfo</el-button
        >
        <el-button>{{ count }}</el-button>

        <hr />
        <demo-next-tick></demo-next-tick>
        <hr />
        <h3>mixins</h3>
        <demo-mixins></demo-mixins>
        <demo-mixins-2></demo-mixins-2> -->
      </el-main>
    </el-container>
  </el-container>
</template> 

<script>
import { mapGetters, mapState, mapMutations, mapActions } from "vuex";
import DemoMixins2 from "../components/DemoMixins-2.vue";
import DemoMixins from "../components/DemoMixins.vue";
import DemoNextTick from "../components/DemoNextTick.vue";
import PageHeader from "../components/PageHeader.vue";
export default {
  components: { PageHeader, DemoNextTick, DemoMixins, DemoMixins2 },
  computed: {
    ...mapState(["count"]), // 使用了Modules后，状态不需要命名空间的名称，还是直接使用状态名。
  },
  methods: {
    modifyUserInfo() {
      this["b/userInfoAc"]({ uaccess: "adminadmin", uname: "阿卜杜C" });
    },

    ...mapActions(["b/userInfoAc"]), // 当使用modules时，映射actions, mutations,getters时，对应的名称前面要加命名空间的名称
    // 如： 原来：  ...mapActions(["userInfoAc"])， 现在：  ...mapActions(["b/userInfoAc"])
  },
};
</script>

<style>
</style>